import path from 'node:path'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import Autoprefixer from 'autoprefixer'
import { visualizer } from 'rollup-plugin-visualizer'
import UnoCSS from 'unocss/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { transformLazyShow } from 'v-lazy-show'
import { defineConfig, loadEnv } from 'vite'
import { CodeEnvType } from '../_share/enums'

export default defineConfig(({ mode }) => {
  const {
    VITE_PORT,
    VITE_PROTOCOL,
    VITE_BASE_URL,
  // eslint-disable-next-line node/prefer-global/process
  } = loadEnv(mode, process.cwd())

  return {
    plugins: [
      vue({
        script: {
          propsDestructure: true,
        },
        template: {
          compilerOptions: {
            nodeTransforms: [
              transformLazyShow,
            ],
          },
        },
      }),
      vueJsx({
        transformOn: true,
        mergeProps: true,
      }),
      UnoCSS(),
      AutoImport({
        imports: [
          'vue',
          'vue-router',
          'vue-i18n',
        ],
        resolvers: [],
        dts: 'src/types/global/auto-imports.d.ts',
      }),
      visualizer({
        open: false,
        filename: 'stats.html',
      }),
    ],

    resolve: {
      alias: {
        '@auth': path.resolve(__dirname, './src'),
      },
      extensions: ['.vue', '.js', '.ts', '.jsx', '.tsx', '.json', '.mjs'],
    },

    css: {
      postcss: {
        plugins: [
          Autoprefixer({
            overrideBrowserslist: ['defaults'],
          }),
        ],
      },
    },

    build: {
      sourcemap: mode !== CodeEnvType.PROD,
      minify: 'terser',
      terserOptions: {
        compress: {
          drop_console: true,
          drop_debugger: true,
        },
      },
    },

    server: {
      host: '0.0.0.0',
      origin: VITE_PROTOCOL + VITE_BASE_URL,
      port: +VITE_PORT,
    },
  }
})
